<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/order.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.css">
    <script src="js/order.js"></script>
    <title>订单</title>
</head>
<body>
<!--总容器-->
<div class="wrapper">
    <!--顶部-->
    <div class="header-wrapper" id="header-wrapper">
        <div class="header" id="header">
            <div></div>
            <div><span>订单</span></div>
            <div><i class="fa fa-search"></i> <i class="fa fa-bell-o"></i></div>
        </div>
        <div class="search" id="search">
            <div class="search-1"><i class="fa fa-search"></i>  搜索我的订单</div>
            <div class="search-2"><i class="fa fa-bell-o"></i></div>
        </div>
    </div>
    <!--主体部分-->
    <div class="main">
        <!--最近常买-->
        <div class="recent-order-wrapper">
            <div class="recent-order">
                <div class="recent-first"><span>最近常买</span><span>查看更多商家 <i class="fa fa-angle-right"></i></span></div>
                <div class="blist">
                    <div>
                        <img src="img/order-台北鸡油饭.png" alt="">
                    </div>
                    <div>
                        <img src="img/order-台北鸡油饭.png" alt="">
                    </div>
                    <div>
                        <img src="img/order-台北鸡油饭.png" alt="">
                    </div>
                    <div>
                        <img src="img/order-台北鸡油饭.png" alt="">
                    </div>
                    <div>
                        <img src="img/order-台北鸡油饭.png" alt="">
                    </div>
                    <div>
                        <img src="img/order-查看更多.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <!--全部订单-->
        <div class="all-order">
            <div class="order-top-wrapper" id="order-top-wrapper">
                <div class="order-top" id="order-top">
                    <div class="focus">
                        <span>全部订单</span>
                        <i class="fa fa-caret-down"></i>
                    </div>
                    <div>
                        <span>待评价</span>
                        <i class="fa fa-caret-down"></i>
                    </div>
                    <div>
                        <span>退款</span>
                        <i class="fa fa-caret-down"></i>
                    </div>
                </div>
            </div>

            <div class="order-wrapper">
                <div class="order-container">
                    <div class="container-t">
                        <img src="img/order-鸡油饭图标.png" alt="">
                        <div class="t-right">
                            <div class="right-line1">
                                <p>台北鸡油饭（时代俊园店） <i class="fa fa-angle-right"></i></p>
                                <span>已完成</span>
                            </div>
                            <div class="right-line2">
                                <div><span>近期较大减满</span></div>
                                <div><span>29减1 </span>|<span> 49减3 </span>|<span> 79减5 </span></div>
                            </div>
                        </div>
                    </div>
                    <div class="container-m-wrapper">
                        <div class="m-mask">
                            <p>¥27.4</p>
                            <span>共 5 件</span>
                        </div>
                        <div class="container-m">

                            <div class="m-li">
                                <img src="img/order-已下架.png" alt="">
                                <p>台北鸡油饭···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-咸菜免费送.png" alt="">
                                <p>咸菜免费送···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                        </div>
                    </div>
                    <div class="container-b">
                        <button>再来一单</button>
                    </div>
                </div>

                <div class="order-container">
                    <div class="container-t">
                        <img src="img/order-鸡油饭图标.png" alt="">
                        <div class="t-right">
                            <div class="right-line1">
                                <p>台北鸡油饭（时代俊园店） <i class="fa fa-angle-right"></i></p>
                                <span>已完成</span>
                            </div>
                            <div class="right-line2">
                                <div><span>近期较大减满</span></div>
                                <div><span>29减1 </span>|<span> 49减3 </span>|<span> 79减5 </span></div>
                            </div>
                        </div>
                    </div>
                    <div class="container-m-wrapper">
                        <div class="m-mask">
                            <p>¥27.4</p>
                            <span>共 5 件</span>
                        </div>
                        <div class="container-m">

                            <div class="m-li">
                                <img src="img/order-已下架.png" alt="">
                                <p>台北鸡油饭···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-咸菜免费送.png" alt="">
                                <p>咸菜免费送···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                        </div>
                    </div>
                    <div class="container-b">
                        <button>再来一单</button>
                    </div>
                </div>

                <div class="order-container">
                    <div class="container-t">
                        <img src="img/order-鸡油饭图标.png" alt="">
                        <div class="t-right">
                            <div class="right-line1">
                                <p>台北鸡油饭（时代俊园店） <i class="fa fa-angle-right"></i></p>
                                <span>已完成</span>
                            </div>
                            <div class="right-line2">
                                <div><span>近期较大减满</span></div>
                                <div><span>29减1 </span>|<span> 49减3 </span>|<span> 79减5 </span></div>
                            </div>
                        </div>
                    </div>
                    <div class="container-m-wrapper">
                        <div class="m-mask">
                            <p>¥27.4</p>
                            <span>共 5 件</span>
                        </div>
                        <div class="container-m">

                            <div class="m-li">
                                <img src="img/order-已下架.png" alt="">
                                <p>台北鸡油饭···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-咸菜免费送.png" alt="">
                                <p>咸菜免费送···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                        </div>
                    </div>
                    <div class="container-b">
                        <button>再来一单</button>
                    </div>
                </div>

                <div class="order-container">
                    <div class="container-t">
                        <img src="img/order-鸡油饭图标.png" alt="">
                        <div class="t-right">
                            <div class="right-line1">
                                <p>台北鸡油饭（时代俊园店） <i class="fa fa-angle-right"></i></p>
                                <span>已完成</span>
                            </div>
                            <div class="right-line2">
                                <div><span>近期较大减满</span></div>
                                <div><span>29减1 </span>|<span> 49减3 </span>|<span> 79减5 </span></div>
                            </div>
                        </div>
                    </div>
                    <div class="container-m-wrapper">
                        <div class="m-mask">
                            <p>¥27.4</p>
                            <span>共 5 件</span>
                        </div>
                        <div class="container-m">

                            <div class="m-li">
                                <img src="img/order-已下架.png" alt="">
                                <p>台北鸡油饭···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-咸菜免费送.png" alt="">
                                <p>咸菜免费送···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                        </div>
                    </div>
                    <div class="container-b">
                        <button>再来一单</button>
                    </div>
                </div>

                <div class="order-container">
                    <div class="container-t">
                        <img src="img/order-鸡油饭图标.png" alt="">
                        <div class="t-right">
                            <div class="right-line1">
                                <p>台北鸡油饭（时代俊园店） <i class="fa fa-angle-right"></i></p>
                                <span>已完成</span>
                            </div>
                            <div class="right-line2">
                                <div><span>近期较大减满</span></div>
                                <div><span>29减1 </span>|<span> 49减3 </span>|<span> 79减5 </span></div>
                            </div>
                        </div>
                    </div>
                    <div class="container-m-wrapper">
                        <div class="m-mask">
                            <p>¥27.4</p>
                            <span>共 5 件</span>
                        </div>
                        <div class="container-m">

                            <div class="m-li">
                                <img src="img/order-已下架.png" alt="">
                                <p>台北鸡油饭···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-咸菜免费送.png" alt="">
                                <p>咸菜免费送···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                            <div class="m-li">
                                <img src="img/order-台湾盐酥鸡粒.png" alt="">
                                <p>台湾盐酥鸡···</p>
                            </div>
                        </div>
                    </div>
                    <div class="container-b">
                        <button>再来一单</button>
                    </div>
                </div>

            </div>
        </div>
    </div>

    <!--底部-->
    <div class="footer-wrapper">
        <div class="footer">
            <div onclick="window.location.href='index.html' ">
                <i class="fa fa-home fa-3x"></i>
                <span>首页</span>
            </div>
            <div onclick="window.location.href='vip.html' ">
                <i class="fa fa-vimeo fa-3x"></i>
                <span>会员</span>
            </div>
            <div onclick="window.location.href='order.html' ">
                <i class="fa fa-file-text-o fa-3x"></i>
                <span>订单</span>
            </div>
            <div  onclick="window.location.href='mine.html' ">
                <i class="fa fa-user fa-3x"></i>
                <span>我的</span>
            </div>
        </div>
    </div>
</div>
</body>
</html>